import * as React from "react";
import { useState, useMemo, useRef } from "react";
import DrawerPro from "@/components/DrawerPro";
import AutoTable from "@/components/AutoTable";
import PremButton from "@/components/PremButton";
import getcolumns from "./columns";
import { useRequest } from "ahooks";
import { doFetch, getFetch } from "@/utils/doFetch";
import { ExportOutlined, ImportOutlined } from "@ant-design/icons";
import dayjs from "dayjs";
import { Modal, message, List, Typography } from "antd";

function Port(props) {
  const actionRef = useRef(),
    formRef = useRef(),
    formRefs = useRef();
    const [activeTabKey, onTabChange] = useState("stalled");

  const pathconfig = useMemo(() => {
    let pathconf = getcolumns()?.pathconfig ?? {};
    return pathconf;
  }, []);


  const columns = useMemo(() => {
    let defcolumn = getcolumns()?.columns;
    return defcolumn;
  }, []);

  return (
    <div style={{ position: "relative", height: "100%", overflowX: "hidden" }}>
      <AutoTable
        pagetitle="维保计划"
        columns={columns}
        actionRef={actionRef}
        formRef={formRefs}
        path={pathconfig?.list}
        extraparams={{status:activeTabKey}}
        tabList={[
          {
            tab: "未接单",
            key: "stalled",
          },
          {
            tab: "未开始",
            key: "not_started",
          },
          {
            tab: "处理中",
            key: "pending",
          },
          {
            tab: "处理完成",
            key: "complete",
          },
        ]}
        activeTabKey={activeTabKey}
        onTabChange={onTabChange}
      />

    </div>
  );
}

export default Port;
